import React, { Component } from 'react'
import PropTypes from 'prop-types'
import { Button, Form, Input, InputNumber, Radio } from 'antd'

class AdminEditUserForm extends Component {
  constructor (props) {
    super(props)
  }

  render () {
    const layout = {
      labelCol: { span: 8 },
      wrapperCol: { span: 16 },
    }

    const tailLayout = {
      wrapperCol: { offset: 8, span: 16 },
    }

    return (
      <div>
        <Form
          {...layout}
          name="userinfo"
          initialValues={{ gender: 0 }}
          onFinish={this.props.handleFinish}
        >
          <Form.Item label="用户名" name="username" rules={[{ type: 'string' }]}>
            <Input/>
          </Form.Item>
          <Form.Item label="密码" name="password" rules={[{ type: 'string' }]}>
            <Input.Password/>
          </Form.Item>
          <Form.Item label="姓名" name="name" rules={[{ type: 'string' }]}>
            <Input/>
          </Form.Item>
          <Form.Item label="所属部门Id" name="departmentId" rules={[{ type: 'number' }]}>
            <InputNumber/>
          </Form.Item>
          <Form.Item label="邮箱" name="email" rules={[{ type: 'string' }]}>
            <Input/>
          </Form.Item>
          <Form.Item label="年龄" name="age" rules={[{ type: 'number' }]}>
            <InputNumber/>
          </Form.Item>
          <Form.Item label="性别" name="gender" rules={[{ type: 'number' }]}>
            <Radio.Group>
              <Radio value={0}>男</Radio>
              <Radio value={1}>女</Radio>
            </Radio.Group>
          </Form.Item>
          <Form.Item label="手机号" name="phone"
                     rules={[{ type: 'string' }, {
                       validator (rule, value) {
                         if (!/^[0-9]/.test(value)) {
                           return Promise.reject('手机号必须是数字')
                         }
                         return Promise.resolve()
                       }
                     }]}>
            <Input/>
          </Form.Item>
          <Form.Item {...tailLayout}>
            <Button type="primary" htmlType="submit">保存</Button>
          </Form.Item>
        </Form>
      </div>
    )
  }
}

AdminEditUserForm.propTypes = {}

export default AdminEditUserForm
